<?php
session_start();
include_once 'admin/connect.php';
include_once 'head.php';

// 开启错误显示，方便调试
ini_set('display_errors', 1);
error_reporting(E_ALL);

// 验证用户是否登录
if(!isset($_SESSION['loginadmin'])) {
    echo "<script>alert('隐私部分，请先登录后查看！');window.location.href='admin/login.php';</script>";
    exit;
}

// 验证session中的用户是否有效
$sql = "select * from login where user = '" . $_SESSION['loginadmin'] . "' ";
$loginresult = mysqli_query($connect, $sql);
if (!mysqli_num_rows($loginresult)) {
    // session无效，清除session并跳转
    session_unset();
    session_destroy();
    echo "<script>alert('请先登录后查看！');window.location.href='admin/login.php';</script>";
    exit;
}

// 验证通过，获取用户信息
$login = mysqli_fetch_array($loginresult);

// 验证通过后的代码
$time = gmdate("Y-m-d", time() + 8 * 3600);
$article = "select * from article order by id desc";
$resarticle = mysqli_query($connect, $article);

if (!$resarticle) {
    echo "<!-- Debug: Article query failed: " . htmlspecialchars(mysqli_error($connect)) . " -->\n";
}

?>

<head>
    <meta charset="utf-8" />
    <title><?php echo $text['title'] ?> — <?php echo $text['card1'] ?></title>
    <!-- 添加 editor.md 的 CSS -->
    <link rel="stylesheet" href="/admin/editormd/css/editormd.preview.css" />
    <link rel="stylesheet" href="/admin/editormd/css/editormd.css" />
    <!-- jQuery -->
    <script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
    <!-- editor.md -->
    <script src="/admin/editormd/editormd.js"></script>
    <script src="/admin/editormd/lib/marked.min.js"></script>
    <script src="/admin/editormd/lib/prettify.min.js"></script>
</head>

<body>
    <div id="pjax-container">
        <div class="central">
            <div class="title" style="display: flex; justify-content: center; align-items: center; padding: 20px 0;">
                <h1><?php echo $text['deci1'] ?></h1>
            </div>
            <div class="row central central-800">
                <?php
                while ($info = mysqli_fetch_array($resarticle)) {
                    ?>
                    <div
                        class="card col-lg-12 col-md-12 col-sm-12 col-sm-x-12 <?php if ($text['Animation'] == "1") { ?>animated fadeInUp delay-03s<?php } ?>">
                        <div class="little_texts">
                            <a href="page.php?id=<?php echo $info['id'] ?>" class="article-link" onclick="window.location.href=this.href; return false;">
                                <div class="top-title textOneHide"><?php echo $info['articletitle'] ?>
                                    <svg class="little_icon" aria-hidden="true">
                                        <use xlink:href="#icon-zhankai"></use>
                                    </svg>
                                </div>
                            </a>
                            <div class="markdown-preview">
                                <?php 
                                // 获取文章内容的前200个字符作为预览
                                $preview = mb_substr(strip_tags($info['articletext']), 0, 200, 'UTF-8');
                                // 处理图片显示
                                $preview = preg_replace('/!\[(.*?)\]\((.*?)\)/', '<img src="$2" alt="$1" style="max-width:100%; max-height:200px; margin:10px 0;">', $preview);
                                echo $preview;
                                if(mb_strlen($info['articletext'], 'UTF-8') > 200) echo '...';
                                ?>
                            </div>
                            <div class="info">
                                <span>
                                    <svg class="little_icon" aria-hidden="true">
                                        <use xlink:href="#icon-shoucang"></use>
                                    </svg>
                                    <?php echo $info['articlename'] ?> <i>记录于</i> <?php echo $info['articletime'] ?></span>
                            </div>
                        </div>
                    </div>
                    <?php
                }
                ?>
            </div>
        </div>
    </div>

    <?php
    include_once 'footer.php';
    ?>

    <style>
    .markdown-preview {
        padding: 15px;
        margin: 10px 0;
        background: #f8f9fa;
        border-radius: 5px;
    }

    .markdown-preview img {
        max-width: 100%;
        max-height: 200px;
        object-fit: cover;
        border-radius: 5px;
        margin: 10px 0;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }

    .card {
        margin-bottom: 20px;
        transition: transform 0.2s;
    }

    .card:hover {
        transform: translateY(-2px);
    }

    .top-title {
        font-size: 1.2em;
        font-weight: bold;
        margin-bottom: 10px;
    }

    .info {
        color: #666;
        font-size: 0.9em;
        margin-top: 10px;
    }
    </style>

    <script>
    $(function() {
        // 处理图片显示
        $('.markdown-preview').each(function() {
            var content = $(this).html();
            content = content.replace(/!\[(.*?)\]\(\/uploads\/(.*?)\)/g, function(match, alt, path) {
                return '<img src="/uploads/' + path + '" alt="' + alt + '" class="preview-img">';
            });
            $(this).html(content);
        });
        
        // 图片错误处理
        $('img').on('error', function() {
            $(this).attr('src', '/Style/img/image-error.png');
        });

        // 处理文章链接点击
        $('.article-link').click(function(e) {
            e.preventDefault();
            window.location.href = $(this).attr('href');
        });

        // 处理浏览器后退
        window.onpopstate = function(event) {
            if(document.referrer.indexOf('little.php') > -1) {
                window.location.href = 'little.php';
            }
        };
    });
    </script>

</body>

</html>